<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>服务器端发送信息的页面</title>
  <script th:src="@{/static/js/jquery.min.js}"></script>
</head>
<body>
当前在线人数总计
<div id="sum" th:text="${num}"></div>
向客户端发送消息<br/>
<input type="text" id="msg"/><br/>
<input type="button" value="全体发送" onclick="sendAll()"/><br/>
单独向客户端发送消息<br/>
消息：<input type="text" id="userMsg"/><br/>
用户id：<input type="text" id="userId"/><br/>
<input type="button" value="精确发送" onclick="sendOne()"/>


<script type="text/javascript">
    function sendAll() {
        var msg = $("#msg").val();
        if (msg != null) {
            $.ajax({
                    method: 'get',
                    url: '/sendMessages',
                    data: {
                        msg: msg
                    },
                    success: function (data) {
                        console.log(data);
                    }
                }
            )
        } else {
            alert("请填写要发送的内容");
        }
    }
    function sendOne() {
        var msg = $("#userMsg").val();
        var userId = $("#userId").val();
        if (msg != null) {
            $.ajax({
                    method: 'get',
                    url: '/sendMessagesToUser',
                    data: {
                        msg: msg,
                        userId: userId
                    },
                    success: function (data) {
                        console.log(data);
                    }
                }
            )
        } else {
            alert("请填写要发送的内容");
        }
    }
</script>

</body>
</html>